/*
 * @Author: Zeratul
 * @Date: 2020-08-19 17:16:48
 * @LastEditTime: 2020-08-24 03:54:08
 * @FilePath: \sz-h5-2003-react-mobile\zhangminhui\eleme-react\eleme-user\src\pages\LoginPage\index.js
 */
import React, { Component } from "react";
import { connect } from "react-redux";
import HomePage from "../HomePage";
import { Redirect } from "react-router-dom";
import {changeInputPasswordAction,changeInputTelAction,handleLoginAction} from '../../store/actionCreator/loginAction/index'
class LoginPage extends Component {
  render() {
    const { isLogin, location } = this.props;
    if (isLogin) {
      const redirect = (location.state && location.state.redirect) || "/";
      return <Redirect to={<HomePage />}></Redirect>;
    } else {
      return (
        <div>
          <div className="loginBox">
            <div className="loginImg">
              <img src="" alt=""></img>
            </div>
            <div className="loginInput">
              <input
                className="inputTel"
                placeholder={this.props.inpNamePH}
                onChange={this.props.changeInputTel.bind(this)}
                value={this.props.inputTel}
              ></input>
              <input
                className="inputPassword"
                placeholder={this.props.inputPasswordPH}
                onChange={this.props.changeInputPassword.bind(this)}
                value={this.props.inputPassword}
              ></input>
              <span>{this.props.statement}</span>
              <button onClick={this.props.handleLoginClick.bind(this)}>登陆</button>
            </div>
          </div>
        </div>
      );
    }
  }
}
const mapStateToPorps = (state) => {
  console.log(state);
  return {
    inpNamePH: state.loginReducer.inpNamePH,
    inputPasswordPH: state.loginReducer.inputPasswordPH,
    statement:state.loginReducer.statement,
    inputTel:state.loginReducer.inputTel,
    inputPassword:state.loginReducer.inputPassword
  };
};
const mapDispatchToProps = (dispatch) => {
  return {
    changeInputTel(e){
      dispatch(changeInputTelAction(e.target.value));
    },
    changeInputPassword(e){
      dispatch(changeInputPasswordAction(e.target.value))
    },
    handleLoginClick:function(){
      dispatch(handleLoginAction());
    }
  };
};

export default connect(mapStateToPorps, mapDispatchToProps)(LoginPage);
